<template>
    <div class="layout-pd">
        <div class="system-menu-search mb15">
            <el-select v-model="value" clearable placeholder="请选择审核文件" style="width: 240px">
                <el-option v-for="item in options" :key="item.value" :label="item.label" :value="item.value"
                    @click=" handleClick()" />
            </el-select>
            
        </div>

        <div class="system-role-padding layout-padding-auto layout-padding-view">

            <el-table :data="state.tableData.data">
                <el-table-column prop="uploadtime" :formatter="getLocalTime" label="提交时间" width="300" />
                <el-table-column prop="name" label="作业命名" width="300" />
                <el-table-column prop="sno" label="学号" width="200" />
                <el-table-column prop="state" label="状态" width="200" />
                <el-table-column label="操作" width="300">
                    <template #default="scope">
                        <div>
                            <el-tooltip class="item" effect="dark" content="审核不通过" placement="top-start">
                                <el-button type="danger" v-show="!data.show" :icon="CircleCloseFilled"
                                    @click="successf('审核未通过', scope)" circle />
                            </el-tooltip>

                            <el-tooltip class="item" effect="dark" content="审核通过" placement="top-start">
                                <el-button type="success" v-show="!data.show" :icon="Check" circle
                                    @click="successf('审核通过', scope)" />
                            </el-tooltip>

                            <el-tooltip class="item" effect="dark" content="合格" placement="top-start">
                                <el-button type="success" v-show="data.show" :icon="Check" circle
                                    @click="successf('合格', scope)" />
                            </el-tooltip>

                            <el-tooltip class="item" effect="dark" content="打回" placement="top-start">
                                <el-button type="danger" v-show="data.show" :icon="CircleCloseFilled"
                                    @click="successf('打回', scope)" circle />
                            </el-tooltip>

                            <el-tooltip class="item" effect="dark" content="下载" placement="top-start">
                                <el-button type="info" :icon="Download" circle
                                    @click="dowloadfile(scope.row.url)" />
                            </el-tooltip>
                           
                        </div>
                    </template>
                </el-table-column>

            </el-table>
            <el-pagination @size-change="onHandleSizeChange" @current-change="onHandleCurrentChange" class="mt15"
                :pager-count="5" :page-sizes="[5, 10, 20, 30]" v-model:current-page="state.tableData.param.pageNum"
                background v-model:page-size="state.tableData.param.pageSize"
                layout="total, sizes, prev, pager, next, jumper" :total="state.tableData.total">
            </el-pagination>
        </div>
    </div>


</template>

<script setup lang="ts" name="funTagsView">
import { Session } from '/@/utils/storage';
import { ref, reactive, } from 'vue'
import { scriptApi } from '/@/api/fun/index';
import { map } from '/@/api/mapfiles/index';
import { bind } from '/@/api/bindfiles/index';
import { onMounted } from 'vue';
import { Check, CircleCloseFilled, Download } from '@element-plus/icons-vue'
import { ElMessage } from 'element-plus';
import { receiveMessageOnPort } from 'worker_threads';
import { da } from 'element-plus/es/locale';

const state = reactive<SysRoleState>({
    tableData: {
        data: [],
        total: 0,
        loading: false,
        param: {
            user: JSON.parse(localStorage.getItem("user") || '{}'),
            url: "",
            name: "",
            images: "",
            search: "",
            pageNum: 1,
            pageSize: 5,
            upstete: []
        },

    },
});
//自定义参数
const data = {
    hid: JSON.parse(localStorage.getItem('hid') || '{}'),
    pageNum: 1,
    pageSize: 5,
    state: '',
    state1: '',
    show: false,
    loginId: 0,
    name: "",
}

const value = ref(1)
const options = [
    {
        value: 1,
        label: '模型文件',
    },
    {
        value: 2,
        label: 'UV贴图',
    },
    {
        value: 3,
        label: '绑定文件',
    },
]

//格式化后端返回来的时间
function getLocalTime(value: any) {
    let time = value.uploadtime[0] + '-' + value.uploadtime[1] + '-' + value.uploadtime[2] + ' ' + value.uploadtime[3] + ':' + value.uploadtime[4] + ':' + value.uploadtime[5]
    return time
}


//获取后端所有script的作业
let user = JSON.parse(localStorage.getItem("user") || '{}')
let role = user.role
if (role == 0) {

    data.show = true
}
const handleClick = () => {
    // data.pageNum==1;
    //    state.tableData.param.pageNum==1;

    if (value.value === 1) {
        getAllscript()
    } else if (value.value === 2) {
        getAllMap()
    } else if (value.value === 3) {
        getAllBin()
    }
}

const getAllscript = async () => {
    scriptApi().getScrip(data).then(res => {
        state.tableData.data = res.data.records;
        state.tableData.total = res.data.total;

    })
}


const getAllMap = async () => {
    map().getScrip(data).then(res => {
        state.tableData.data = res.data.records;
        state.tableData.total = res.data.total;
    })
}

const getAllBin = async () => {
    bind().getScrip(data).then(res => {
        state.tableData.data = res.data.records;
        state.tableData.total = res.data.total;
    })
}
//scope.row.modelFile||scope.row.mapFiles||scope.row.bindFiles

//下载文件
const dowloadfile = async (url?: any) => {
    window.open(url)
}


//审核员修改状态
const successf = async (content?: any, scope?: any) => {
    data.loginId = scope.row.loginId
    data.name = scope.row.name
    data.state = content
    if (value.value == 1) {
        scriptApi().updatesctate(data)
        value.value == 1
        // getAllscript()
    } else if (value.value == 2) {
        map().updatesctate(data)
        value.value == 2
        // getAllMap();
    } else if (value.value == 3) {
        bind().updatesctate(data)
        value.value == 3
    }
    handleClick()
    //点击后刷新当前页面
    //ElMessage(`${content}`);
    //location.reload()
}

// 分页改变
const onHandleSizeChange = (val: number) => {
    // state.tableData.param.pageSize = val;
    data.pageSize = val;
    handleClick();

};
// 分页改变
const onHandleCurrentChange = (val: number) => {
    // state.tableData.param.pageNum = val;
    data.pageNum = val;
    handleClick();

};


// const onSetAuth = () => {
//     // https://gitee.com/lyt-top/vue-next-admin/issues/I5C3JS
//     // 清除缓存/token等
//     Session.clear();
//     // 使用 reload 时，不需要调用 resetRoute() 重置路由
//     window.location.reload();

// };


//页面加载时去执行
onMounted(() => {
    // getAllscript()
    handleClick()
})
</script>

<style scoped lang="scss">
.flex-warp {
    display: flex;
    flex-wrap: wrap;
    align-content: flex-start;
    margin: 0 -5px;

    .flex-warp-item {
        padding: 5px;

        .flex-warp-item-box {
            width: 100%;
            height: 100%;
        }
    }
}

.error {
    height: 100%;

    .error-flex {
        margin: auto;
        display: flex;
        height: 450px;
        width: 1050px;

        .left {
            flex: 1;
            height: 100%;
            align-items: center;
            display: flex;

            .left-item {
                .left-item-animation {
                    opacity: 0;
                    animation-name: error-num;
                    animation-duration: 0.5s;
                    animation-fill-mode: forwards;
                }

                .left-item-num {
                    color: var(--el-color-info);
                    font-size: 55px;
                }

                .left-item-title {
                    font-size: 20px;
                    color: var(--el-text-color-primary);
                    margin: 15px 0 5px 0;
                    animation-delay: 0.1s;
                }

                .left-item-msg {
                    color: var(--el-text-color-secondary);
                    font-size: 12px;
                    margin-bottom: 30px;
                    animation-delay: 0.2s;
                }

                .left-item-btn {
                    animation-delay: 0.2s;
                }
            }
        }

        .right {
            flex: 1;
            opacity: 0;
            animation-name: error-img;
            animation-duration: 2s;
            animation-fill-mode: forwards;

            img {
                width: 100%;
                height: 100%;
            }
        }


    }
}
</style>



<!-- <template>
	<div class="fun-tagsview layout-pd">
		<NoticeBar
			text="已删除非当前页 tagsView 演示，后续有时间可以再加回来！，tagsview 支持多标签（参数不同）、单标签共用（参数不同）"
			background="#ecf5ff"
			color="#409eff"
		/>
		<el-card shadow="hover" header="tagsView 当前页演示" class="mt15">
			<div class="flex-warp">
				<div class="flex-warp-item">
					<div class="flex-warp-item-box">
						<el-button type="primary" size="default" @click="refreshCurrentTagsView">
							<el-icon>
								<ele-RefreshRight />
							</el-icon>
							刷新当前页
						</el-button>
					</div>
				</div>
				<div class="flex-warp-item">
					<div class="flex-warp-item-box">
						<el-button type="info" size="default" @click="closeCurrentTagsView">
							<el-icon>
								<ele-Close />
							</el-icon>
							关闭当前页
						</el-button>
					</div>
				</div>
				<div class="flex-warp-item">
					<div class="flex-warp-item-box">
						<el-button type="warning" size="default" @click="closeOtherTagsView">
							<el-icon>
								<ele-CircleClose />
							</el-icon>
							关闭其它
						</el-button>
					</div>
				</div>
				<div class="flex-warp-item">
					<div class="flex-warp-item-box">
						<el-button type="danger" size="default" @click="closeAllTagsView">
							<el-icon>
								<ele-FolderDelete />
							</el-icon>
							全部关闭
						</el-button>
					</div>
				</div>
				<div class="flex-warp-item">
					<div class="flex-warp-item-box">
						<el-button type="success" size="default" @click="openCurrenFullscreen">
							<el-icon>
								<ele-FullScreen />
							</el-icon>
							当前页全屏
						</el-button>
					</div>
				</div>
			</div>
		</el-card>
	</div>
</template>

<script setup lang="ts" name="funTagsView">
import { defineAsyncComponent } from 'vue';
import { useRoute } from 'vue-router';
import mittBus from '/@/utils/mitt';

// 引入组件
const NoticeBar = defineAsyncComponent(() => import('/@/components/noticeBar/index.vue'));

// 定义变量内容
const route = useRoute();

// 0 刷新当前，1 关闭当前，2 关闭其它，3 关闭全部 4 当前页全屏
// 1、刷新当前 tagsView
const refreshCurrentTagsView = () => {
	mittBus.emit('onCurrentContextmenuClick', Object.assign({}, { contextMenuClickId: 0, ...route }));
};
// 2、关闭当前 tagsView
const closeCurrentTagsView = () => {
	mittBus.emit('onCurrentContextmenuClick', Object.assign({}, { contextMenuClickId: 1, ...route }));
};
// 3、关闭其它 tagsView
const closeOtherTagsView = () => {
	mittBus.emit('onCurrentContextmenuClick', Object.assign({}, { contextMenuClickId: 2, ...route }));
};
// 4、关闭全部 tagsView
const closeAllTagsView = () => {
	mittBus.emit('onCurrentContextmenuClick', Object.assign({}, { contextMenuClickId: 3, ...route }));
};
// 5、开启当前页面全屏
const openCurrenFullscreen = () => {
	mittBus.emit('onCurrentContextmenuClick', Object.assign({}, { contextMenuClickId: 4, ...route }));
};
</script>

<style scoped lang="scss">
.fun-tagsview {
	.fun-tagsview-from-item {
		:deep(.el-form-item__content) {
			margin-left: 0 !important;
		}
	}
}
</style> -->
